<template>
  <el-container>
    <el-header class="">
      <div>
        <img src="../../../static/img/indexHeader.png" style="width: 1480.2px;height: 90px;" />
      </div>
<!--      <el-row>
        <el-col :span="8">
          <span style="margin-left: 10px,0px,0px,100px; font-size: large;color: #FFFFFF;">欢迎来到彬彬吧</span>
        </el-col>
        <el-col :span="8">
          <div style="margin-top: 5px;">
            <el-button type="success" round><i class="el-icon-apple"></i>修改密码</el-button>
            <el-button type="success" round><i class="el-icon-apple"></i>退出登录</el-button>
            <el-button type="success" round><i class="el-icon-apple"></i>系统管理</el-button>
          </div>
        </el-col>
        <el-col :span="8">
          <div style="margin-top: 5px;">
            <img src="../../static/img/qq.gif" width="50" height="50" style="border-radius: 50%;" />
            <span>用户名:{{userName}}</span>
          </div>
        </el-col>
      </el-row> -->
    </el-header>
    <el-container style="margin-top: 40px;">
      <el-aside width="200px">
      <el-menu :default-openeds="['1','2','3','4','5']" router  background-color="#ddd">
        <template v-for="x in node">
          <el-submenu :index="x.index">
             <template slot="title"><i class="el-icon-message"></i>{{x.name}}</template>
              <template v-for="y in x.children">
                <el-menu-item :index="y.url"><i class="el-icon-message"></i>{{y.name}}</el-menu-item>
              </template>
          </el-submenu>
        </template>
<!--     	<el-submenu index="1">
      	     <template slot="title"><i class="el-icon-message"></i>导航一</template>
      		<el-menu-item index="/indexElement/userListElement"><i class="el-icon-message"></i>选项1</el-menu-item>
      		<el-menu-item index="1-2"><i class="el-icon-message"></i>选项2</el-menu-item>
        </el-submenu>
     	<el-submenu index="2">
      	     <template slot="title"><i class="el-icon-message"></i>导航一</template>
      		<el-menu-item index="/index/list"><i class="el-icon-message"></i>选项1</el-menu-item>
      		<el-menu-item index="1-2"><i class="el-icon-message"></i>选项2</el-menu-item>
        </el-submenu>
        <el-submenu index="3">
             <template slot="title"><i class="el-icon-message"></i>导航一</template>
        	<el-menu-item index="/index/list"><i class="el-icon-message"></i>选项1</el-menu-item>
        	<el-menu-item index="1-2"><i class="el-icon-message"></i>选项2</el-menu-item>
        </el-submenu>
        <el-submenu index="4">
             <template slot="title"><i class="el-icon-message"></i>导航一</template>
        	<el-menu-item index="/index/list"><i class="el-icon-message"></i>选项1</el-menu-item>
        	<el-menu-item index="1-2"><i class="el-icon-message"></i>选项2</el-menu-item>
        </el-submenu> -->

      </el-menu>

      </el-aside>
      <el-container>
        <el-main>
             <router-view/>
        </el-main>
        <el-footer>Footer</el-footer>
      </el-container>
    </el-container>
  </el-container>
</template>

<script>
  import myUtil from "../../util/myUtil"
  export default{
    name:"indexElement",
    data(){
      return{
        userName:"",
        node:[
          {index:'1',name:"导航一",children:[{url:"/",name:"选项1"},{url:"/",name:"选项2"}]},
          {index:'2',name:"导航二",children:[{url:"/",name:"选项1"},{url:"/",name:"选项2"}]},
          {index:'3',name:"导航三",children:[{url:"/",name:"选项1"},{url:"/",name:"选项2"}]}
        ]
      }
    },
    methods:{
     loadPwoer(){
       var mythis = this;
       $.ajax({
           url:myUtil.url+"/user-info/selectPower",
           type:"get",
           data:{"userName": mythis.userName},
           dataType:"json",
           success:function(data){
               console.log(data)
               mythis.node = data.info

           }

       })
     }
    },
    mounted(){
      //取出本地存储的用户名
      this.userName=localStorage.getItem("userName");
      this.loadPwoer();
    }
  }
</script>

<style>
  html,
  body {
    height: 100%;
  }

  .login-one {
    background-color: #55aaff;
    background-image: url(../../../static/img/light.png);
    background-repeat: no-repeat;
    /*	//background-position:center top;*/
    overflow: hidden;
    height: 100%;
  }
</style>
